<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>10 demo2</title>
    <link rel="stylesheet" href="../static/css/style.css">
    <link rel="stylesheet" href="../static/css/highlight.default.min.css">

    <script src="../static/js/marked.min.js"></script>
    <script src="../static/js/highlight.min.js"></script>
</head>

<body>
    <h1>10 demo2</h1>
    
    <div id="div">
        <button id="btn1">按钮</button>
    </div>
    <script>
        var btn1 = document.getElementById("btn1");
        btn1.addEventListener("click", demo1);
        btn1.addEventListener("click", demo2);
        btn1.addEventListener("click", demo3);
        // 一次点击后，会依次执行绑定的两个函数
        function demo1() {
            alert("DOM2级事件处理程序1")
        }
        function demo2() {
            alert("DOM2级事件处理程序2")
        }
        function demo3() {
            alert("DOM2级事件处理程序3")
        }
        btn1.removeEventListener("click", demo2);
    </script>
</body>

</html>